<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale =1.0, maximum-scale=1.0, user-scalable=no"/>
    <title>悦邻舍</title>
    <link rel="stylesheet" href="../assets/css/reset.css">
    <link rel="stylesheet" href="../assets/css/common.css">
    <link rel="stylesheet" href="../assets/font/iconfont.css">
    <link rel="stylesheet" href="../assets/css/component.css">
    <link rel="stylesheet" href="../assets/css/articleDetail.css">
</head>
<body >

<div id="pageApp">
    <div class="ykl-layout" v-cloak>
       <div class="top-block">
        <h3 class="art-sup-title">{{articleDetail.title}}</h3>
        <p  class="to-see-img-text" v-if="articleDetail.phone && artType == 2">{{articleDetail.phone}}</p>
        <p  class="to-see-img-text" v-if="!articleDetail.phone && artType == 2">见截图</p>
        <p  class="art-other-msg">
            <span class="art-prev" v-if="prevArtileId" @click="chageArt(prevArtileId)">上一篇</span>
            <span class="art-createtime">{{articleTime}}</span>
            <span class="art-next" v-if="nextArtileId" @click="chageArt(nextArtileId)">下一篇</span>
        </p>
        <div class="art-content" :style="{top:contentTop}">
            <div class="art-content-detail" v-if="artType == 1" v-html="articleDetail.content"></div>
            <div class="art-content-detail" v-if="artType == 2">
             <img v-for="item in articleDetail.artImg" :src="item">
             <p>{{articleDetail.content}}</p>
            </div>
            <div class="fav-or-comment-area">
                <p class="area-item-title" v-if="artType == 1">支持<span>({{favList.length}})</span></p>
                <p class="area-item-title" v-if="artType == 2">感谢<span>({{favList.length}})</span></p>
                <div class="fav-user">
                    <img v-for="item in favList" :src="item.img"  :style="{left:item.left}">
                </div>
                <p class="area-item-title" v-if="artType == 1">意见<span>({{commentList.length}})</span></p>
                <p class="area-item-title" v-if="artType == 2">评语<span>({{commentList.length}})</span></p>
                <ul class="comment-list">
                    <li class="comment-item" v-for="item in commentList">
                        <img :src="item.img" class="comment-user-img">
                        <div>
                            <p class="comment-msg">
                                <span class="user-name">{{item.nickName}}</span>
                                <span class="comment-time">{{item.time}}</span>
                            </p>
                            <p class="comment-content">{{item.Content}}</p>
                        </div>
                    </li>
                </ul>
                <br/> <br/>
            </div> 
        </div>
       </div>
       <div class="bottom-bar-wraper">
            <div class="bottom-bar">
                <p class="support-btn" @click="toSupport">
                    <span class="iconfont icon-dianzan" :class="{'has-support':hasSupport}"  v-if="artType == 1">点赞</span>
                    <span class="iconfont icon-love" :class="{'has-support':hasSupport}"  v-if="artType == 2">感谢</span>
                </p>
                <p class="opinion-btn" @click="addOpinion" :class="{'to-add-option':toAddOpinion}">
                    <span class="iconfont icon-bianji" v-if="artType == 1">意见</span>
                    <span class="iconfont icon-bianji" v-if="artType == 2">评语</span>
                </p>
            </div>
       </div>
    </div>
 </div>  
    <script src="../assets/js/jquery.min.js"></script>
    <script src="../assets/js/vue.min.js"></script>

    <script src="../assets/js/gkee.js"></script>
    <script src="../assets/js/gtr.js"></script>

    <script src="../assets/js/component.js"></script>
    <script src="../assets/js/articleDetail.js"></script>

    <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <script src="../assets/js/collector.js"></script>
    <script src="../assets/js/wechat.js"></script>
    <script src="../assets/js/wechat-shared.js"></script>
    
    <script>
        wechat.ready(function () {
            initPage();
        });
    </script>
</body>
</html>

